import { Component, OnInit, EventEmitter } from "@angular/core";

import { SubTitleLists } from "../interface-shared";
import { TableTab } from "../interface-shared";

@Component({
  selector: "tab",
  templateUrl: "tab.component.html",
  styleUrls: ["tab.component.less"],
  inputs: ["lists", 'activeTab', 'tabClicked', 'change'],
  outputs: ["tabToggle"]
})

export class TabComponent implements OnInit {
  lists: SubTitleLists[];
  tabToggle = new EventEmitter<number>();
  currentTabIndex = 0;
  activeTab: number;
  tabClicked: any;
  mustChange: boolean;
  constructor () {}

  ngOnInit () {}

  ngOnChanges () {
    if (this.tabClicked && !this.tabClicked.flag) {
      this.currentTabIndex = this.activeTab
    }
  }

  tabClick (id, className) {
    this.currentTabIndex = id;
    this.tabToggle.emit(className);
  }

  tabActive (id) {
    return id === this.currentTabIndex;
  }

  trackByTab (index: number, tab: TableTab) {
    return tab.class
  }
}